import React ,{ useState } from 'react'
import { HashRouter, BrowserRouter,Route,Routes,Navigate } from 'react-router-dom'
import { Button, Space } from 'antd';
import Login from './pages/Login';
import NavPage from './pages/nav';
import Home from './pages/home';
import Todo from './components/Todo';
import Mine from './components/mine';
import UserList from './pages/UserList';
import AddUser from './pages/AddUser';
import ums from './apis/ums';
import { eventBus } from './utils/eventBus';
const routes = [
  { path: "home", element: Home, roles: ["超级管理员"] },
  // { path: "shopList", element: ShopList },
  // { path: "addShop", element: AddShop, roles: ["超级管理员"] },
  { path: "userList", element: UserList},
  { path: "addUser", element: AddUser, roles: ["超级管理员"] },
  { path: "mine", element:Mine },
]
function filterData(arr,role){
  return arr.filter(item=>!item.roles || item.roles.includes(role)).map(item=>{
      const o = {
        ...item,
      }
      if(item.children){
          o.children = filterData(item.children,role);
      }
      return o;
  })
}
function App() {
  const [,foru]=React.useState({})
  React.useEffect(()=>{
    eventBus.addListener("refreshRoutes", () => {
            foru({})
    })
},[]);
function renderRoutes (){
  const user = localStorage.user;
  let arr = [];
  if (!user) {
    arr = routes;
  } else {
    arr = filterData(routes, JSON.parse(user).role)
  }
  return arr.map(item => {
    const { element: Comp } = item;
    return <Route key={item.path} path={item.path} element={<Comp />} />
  })
}
      // if (localStorage.token) {
      // }else{
      //   window.location.hash='#/login'
      //   return null 
      // }
  return (
   <HashRouter>
    <Routes>
      <Route path='/' element={<Navigate to={"/login"} />}> </Route>
      <Route path='/Login' element={<Login/>}> </Route>
      <Route path='/NavPage'  element={<NavPage/>}> 
           {/* <Route path='home' element={<Home/>}> 333</Route>
           <Route path='todo' element={<Todo/>}> 333</Route>
           <Route path='userList' element={<UserList/>}> </Route>
           <Route path='mine' element={<Mine/>}> </Route>
           <Route path='addUser' element={<AddUser/>}> </Route> */}
           {renderRoutes()}
      </Route>
    </Routes>
   </HashRouter>
  )
}

export default App
